﻿<link href="//cdn.bootcss.com/font-awesome/4.5.0/css/font-awesome.css" rel="stylesheet" />
<style>
    .txl img {
        border: 0;
        max-width: 100%;
        height: auto;
        vertical-align: top;
    }

    .txl ol, ul {
        list-style: none;
    }

    .txl ul, li {
        padding: 0;
        margin: 0;
    }

    .mess.has-mess i:before {
        content: "";
        display: block;
        width: 8px;
        height: 8px;
        position: absolute;
        left: 1.3rem;
        top: 0.1rem;
        border-radius: 8px;
        background-color: #f15a4a;
    }

    .mes-icon.has-mess:before {
        content: "";
        display: block;
        width: 0.55rem;
        height: 0.55rem;
        position: absolute;
        right: 0.3rem;
        top: -0.2rem;
        border-radius: 0.4rem;
        background-color: #f15a4a;
    }
    /*header*/
    .logo {
        display: block;
        float: left;
        font-size: 1.6em;
        color: #10bdf7;
        height: 2.2rem;
        line-height: 2.2rem;
    }

        .logo img {
            width: 1.25rem;
            height: auto;
            vertical-align: middle;
        }

    .header .user-btn {
        display: block;
        float: right;
        width: 1.25rem;
        margin-top: 0.5rem;
        height: 1.25rem;
        background-image: url(/View_Mobile/images/user-icon.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }

    .header .search-btn {
        background-image: url(/View_Mobile/images/earch-icon.png);
        margin-right: 0.8rem;
        background-size: 70% auto;
    }

    .user-btn:hover {
        opacity: 0.7;
    }
    /*mess 页面*/
    .mess {
        background-color: #fff;
    }

        .mess .header {
            background-color: #f8f8f8;
            box-shadow: 0 1px 3px #aaa;
        }

    .mess-lis > li {
        height: 2.5rem;
        padding: 0.8rem;
        border-bottom: 1px solid #eee;
        padding-top: 0.4rem;
        padding-bottom: 0.4rem;
    }

    .mess-lis li a {
        display: block;
        height: 1.7rem;
        line-height: 1.7rem;
    }

    .mess-lis li:hover {
        background-color: #fafafa;
    }

    .mess-lis .mes-icon {
        display: block;
        height: 1.7rem;
        position: relative;
    }

    .mess-r {
        height: 1.7rem;
    }

    .mes-icon {
        margin-top: 0rem;
        width: 2.1rem;
        float: left;
    }

        .mes-icon img {
            width: 1.7rem;
            border-radius: 0.3rem;
            opacity: .9;
        }

    .mess-lis h4 {
        font-size: 0.6rem;
        line-height: 1rem;
        height: 1rem;
        margin-top: 0rem;
    }

    .mess-r p {
        color: #b9b3b3;
        font-size: 0.5rem;
        line-height: 0.6rem;
        height: 0.6rem;
        white-space: nowrap;
        overflow: hidden;
    }

    /*加号模块*/

    .mod-mask {
        position: fixed;
        width: 100%;
        height: 100%;
        background-color: rgba(240,240,240,.9);
        left: 0;
        top: 0;
    }

    .mod-body {
        min-width: 320px;
        margin-left: auto;
        margin-right: auto;
        max-width: 720px;
        position: relative;
    }

        .mod-body > ul {
            position: fixed;
            width: 100%;
            right: 0;
            bottom: 2rem;
            padding: 0.82rem;
        }

            .mod-body > ul > li {
                height: 2.4rem;
            }

        .mod-body .mod-li-icon {
            display: block;
            height: 2rem;
            margin-top: 0.2rem;
            float: right;
        }

    .mod-li-icon img {
        height: 100%;
        width: auto;
    }

    .mod-body .mod-li-tip {
        float: right;
        margin-right: 1rem;
        height: 1.4rem;
        line-height: 1.4rem;
        margin-top: 0.4rem;
        border-radius: 4px;
        text-align: center;
        width: 8rem;
        font-size: 0.6rem;
        color: #858585;
        background-color: #fff;
        box-shadow: 0px 0px 8px #aaa;
    }

    #module_plus {
        display: none;
    }




    .address {
        background-color: #d9d8dd;
        padding-bottom: 2.5rem;
    }

        .address .header {
            background-color: #393a3f;
            line-height: 2.2rem;
            color: #fff;
            font-size: 0.4rem;
            position: relative;
        }

    /*.back {
        position: absolute;
        left: 0.82rem;
        width: 1rem;
        height: 1rem;
        display: block;
        background-image: url(/View_Mobile/images/back.png);
        background-size: auto 100%;
        top: 0.6rem;
        background-position: center center;
        background-repeat: no-repeat;
    }

        .back:hover {
            opacity: .7;
        }*/

    .search-box {
        height: 2.2rem;
        padding: 0.41rem;
    }

        .search-box .inp-s {
            background-color: #fff;
            border-radius: 4px;
            display: block;
            height: 1.38rem;
            width: 100%;
            font-size: 1em;
            border: none;
            background: #fff url(../images/zoom.png) no-repeat 0.82rem center;
            background-size: 0.8rem auto;
            text-align: left;
            padding-left: 2rem;
            line-height: 1.38rem;
        }

    .selected-per {
        height: 3.82rem;
        background-color: #fff;
        padding: 0.41rem;
    }

        .selected-per li {
            float: left;
            text-align: center;
            margin-right: 2%;
        }

            .selected-per li:hover {
                opacity: .7;
            }

            .selected-per li:nth-of-type(6n) {
                margin-right: 0;
            }

        .selected-per a {
            width: 100%;
            display: block;
            margin-left: auto;
            margin-right: auto;
        }

        .selected-per img {
            width: 100%;
            height: auto;
            margin-left: auto;
            margin-right: auto;
        }

        .selected-per span {
            font-size: 12px;
            display: block;
            margin-top: 0.5em;
            white-space: nowrap;
            color: #898989;
        }

    .sel-title {
        height: 2rem;
        margin-top: 0;
        padding: 0.41rem;
        border-bottom: #eee 1px solid;
        background-color: #fff;
        line-height: 2.58rem;
    }

    .sel-btn {
        display: block;
        text-align: center;
        float: left;
        height: 1.20rem;
        line-height: 1.20rem;
        width: 30%;
        border-radius: 4px;
        border: 1px solid #b2b2b2;
        color: #4e4e4e;
        font-size: 1.2em;
    }
    /*.check input[type="check"]*/
    .check {
        position: relative;
        height: 100%;
        line-height: 1.2rem;
        display: inline-block;
        float: right;
        padding-right: 1.2rem;
        color: #4e4e4e;
    }

        .check input[type="checkbox"] {
            display: none;
        }

    .check-icon {
        display: inline-block;
        height: 0.8rem;
        width: 0.8rem;
        background-image: url(/View_Mobile/images/uncheck.png);
        background-size: 100% auto;
        position: absolute;
        top: 50%;
        right: 0;
        transform: translate(0,-50%);
        -webkit-transform: translate(0,-50%);
    }

    .check input[type="checkbox"]:checked + .check-icon {
        background-image: url(/View_Mobile/images/checked.png);
    }

    .add-lists { /*padding: 0.41rem;*/
        background-color: #fff;
    }

    .arr {
        text-indent: -9999rem;
        display: block;
        width: 0.6rem;
        height: 0.6rem;
        background: url(/View_Mobile/images/arr-l.png) center center no-repeat;
        background-size: auto 100%;
        position: absolute;
        left: 0.41rem;
        top: 0.83rem; /*transform:translate(0,-50%);*/
    }
    /*.arr-l{ background-image: url(../images/arr-l.png)}*/
    .arr-d {
        background-image: url(/View_Mobile/images/arr-d.png);
        background-size: 100% auto;
    }

    .add-li {
        line-height: 2.1rem;
        position: relative;
        background-color: #fff;
    }

        .add-li .check {
            position: absolute;
            right: 0.51rem;
            top: 0;
        }

            .add-li .check .check-icon {
                top: 0.73rem;
                transform: none;
                -webkit-transform: none;
            }

        .add-li a {
            display: block;
            padding-left: 1.5rem;
            color: #4e4e4e;
            height: 2.1rem;
            border-bottom: 1px dashed #eee;
        }

            .add-li a:hover {
                background-color: #f7f7f7;
            }

    .sublis .add-li a {
        padding-left: 2.5rem;
    }

    .sublis .add-li .arr {
        left: 1rem;
    }

    .add-count {
        color: #8f8f8f;
        font-size: 0.7em;
        float: right;
        padding-right: 1.5rem;
    }

    .subper a {
        padding-left: 0rem;
    }

    .subper .add-li {
        padding: 0;
        padding-left: 10px;
        padding-top: .4rem !important;
    }

        .subper .add-li a {
            height: 2.5rem;
            padding-left: 0.8rem;
            border-bottom: 1px dashed #f1f1f1;
        }

        .subper .add-li .mes-icon, .subper .add-li .mess-r {
            margin-top: 0rem !important;
        }

    .add .footer {
        background-color: #f7f7f7;
        border-top: 1px solid #b0b0b0;
        padding: 0.41rem;
    }

    .add-btn {
        height: 100%；;
    }

        .add-btn li {
            height: 100%;
            width: 48%;
            float: left;
        }

            .add-btn li a {
                display: block;
                height: 100%;
                text-align: center;
                border: 1px solid #c9c9c9;
                border-radius: 4px;
                background-color: #fff;
                height: 1.6rem;
                line-height: 1.6rem;
                font-size: 1.4em;
            }

                .add-btn li a:hover {
                    opacity: .7;
                }

    .cancel {
        margin-right: 4%;
    }

    .add-btn .ensure a {
        background-color: #33cd31;
        border: none;
        height: 1.66rem;
        line-height: 1.66rem;
        color: #fff;
    }

    .detail-title h1 {
        text-align: left;
        padding-left: 1.5rem;
    }

    .user-block {
        position: relative;
    }

        .user-block .uname {
            width: 2.5rem;
            display: block;
            text-align: center;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%,-50%);
            -webkit-transform: translate(-50%,-50%);
            color: #fff;
        }

    .uname img {
        width: 100%;
        height: auto;
        margin-bottom: 0.4rem;
    }

    .detail-lis {
        margin-top: 1rem;
        border-top: 1px solid #cccccc;
    }

        .detail-lis li {
            height: 2.3rem;
            line-height: 2.3rem;
            border-bottom: 1px solid #cccccc;
            background-color: #fff;
            padding-left: 0.41rem;
            padding-right: 0.41rem;
        }

            .detail-lis li:hover {
                background-color: #f7f7f7;
            }

    .txl .label {
        width: 35%;
        display: inline-block;
        color: #484848;
    }

    .detail {
        width: 65%;
        display: inline-block;
        font-size: 0.9em;
        color: #8b8b8b;
    }

    .btn-phone {
        display: block;
        width: 90%;
        border-radius: 4px;
        background-color: #33cd31;
        text-align: center;
        height: 2.3rem;
        line-height: 2.3rem;
        color: #fff;
        font-size: 1.3em;
        margin-left: auto;
        margin-right: auto;
        margin-top: 1.5rem;
    }

        .btn-phone:hover {
            opacity: .7;
        }

        .btn-phone img {
            height: 1rem;
            vertical-align: middle;
        }

    .fa-check-square {
        font-size: 1.2rem;
        color: darkgray;
        position: absolute;
        right: 0;
        top: 0.73rem;
    }

    .sel {
        color: cornflowerblue !important;
    }
    .pbottom{padding-bottom:44px;}
</style>
<div ms-controller="TXL" class="txl">
    <div class="content" ms-class-1="pbottom:isseltype">
    <div class="search-box">
        <input type="text" class="inp-s" placeholder="请输入姓名/手机号" ms-duplex="searstr">
    </div>
    <div class="sel-title" ms-if="isseltype">
        <a external class="sel-btn" style="display:none">组织机构</a>
        <label class="check" ms-if="isseltype" ms-on-click="checkall(this)"><span ms-if="selusers.size()>0" style="color:blue;">已选:{{selusers.size()}}人</span>&nbsp;<span ms-visible="!singleSelect">全选<i class="fa fa-square-o fa-check-square" ms-class-1="sel:selAll" style="top:0"></i></span></label>
        <!--<a   external  class="button button-success" style="width:100px;float:right;height: 1.20rem;line-height:1.20rem;" ms-click="selpeople()">确定</a>-->
       <!-- <a external class="button button-success" style="width:60px;float:right;margin-right:10px; height: 1.20rem;line-height:1.20rem;" ms-click="selpeople()">确定</a>
        <a external class="button button-danger" style="width: 60px; float: right; margin-right: 10px; height: 1.20rem; line-height: 1.20rem;" ms-click="qxpeople()">取消</a>-->

    </div>
    <div class="selected-per" ms-if="isseltype && selusers.size()>0" style="overflow: auto;">
        <ul class="clearfix">
            <li ms-repeat-seluser="selusers">
                <a external><img ms-click="clearuser(seluser,this)" style="max-height:45PX;max-width:45PX;    min-width: 45PX;min-height: 45PX;border-radius: 0.3rem;opacity: .9;" ms-attr-src="/ViewV5/Base/DownFile.aspx?type=TX&user={{seluser.UserName}}"><span>{{seluser.UserRealName}}</span></a>
            </li>
        </ul>
    </div>
    <div class="add-lists" style="overflow:auto">
        <script type="avalon" id="tmpltree">
            <ul class="main-lis clearfix">
                <li class="add-li bmsel" ms-repeat-bm="bm.SubDept" ms-visible="bm.DeptUser.size()>0||bm.SubDept.size()>0" style="padding-left: 10px;">
                    <span class="arr arr-l" ms-if="!searstr"></span><a ms-if="!searstr" ms-on-click="entbm(bm,this)" external>{{bm.DeptName}}{{bm.DeptUserNum}}</a>
                    <label class="check" ms-if="isseltype" style="height:2.1rem;padding-left:10px;" ms-on-click="checkbm(bm,this)" ms-visible="!singleSelect">
                        <i class="fa fa-square-o fa-check-square fabm" ms-attr-id="'branch'+bm.DeptCode"></i>
                    </label>
                    <div class="puser"  ms-include="'tmpltree'" ms-visible="searstr"></div>
                </li>
            </ul>
            <ul class="subper mess-lis">
                <li class="add-li" ms-repeat-user="bm.DeptUser" ms-visible="(searstr&&(user.UserRealName.indexOf(searstr)!=-1||user.mobphone.indexOf(searstr)!=-1))||!searstr">
                    <span class="clearfix" external>
                        <span class="mes-icon">
                            <img ms-attr-src="/ViewV5/Base/DownFile.aspx?type=TX&user={{user.UserName}}">
                        </span>
                        <div class="mess-r "> <span ms-if="isseltype"><h4 style="margin-bottom:0">{{user.UserRealName.length==2?user.UserRealName.substring(0,1)+'&nbsp;&nbsp;&nbsp;&nbsp;'+user.UserRealName.substring(1):user.UserRealName}}&nbsp; <font style="color:cornflowerblue"><i class="fa  fa-mobile-phone"></i>{{user.mobphone}}</font>  </h4> <p style="margin:0">{{user.zhiwu}}</p></span>  <a ms-attr-href="'tel:'+user.mobphone" external ms-if="!isseltype"><h4 style="margin-bottom:0">{{user.UserRealName.length==2?user.UserRealName.substring(0,1)+'&nbsp;&nbsp;&nbsp;&nbsp;'+user.UserRealName.substring(1):user.UserRealName|html}}&nbsp;<font style="color:cornflowerblue"><i class="fa  fa-mobile-phone"></i>{{user.mobphone}}</font>  </h4> <p style="margin:0">{{user.zhiwu}}</p></a>  </div>
                    </span>
                    <label class="check" ms-if="isseltype" ms-on-click="checkuser(user,this,$event)" style="padding-left:10px;">
                        <i class="fa fa-square-o fa-check-square fauser" ms-attr-username="user.UserName" ms-attr-userrealname="user.UserRealName" ms-attr-id="'user'+replace(user.UserName)"></i>
                    </label>
                    <span style="right:.8rem;position:absolute;float:right;top:0;    display: -webkit-box;" ms-if="!isseltype">
                        <a ms-attr-href="javascript:ComFunJS.openEntChat('{{user.UserName}}')" external style=" padding-top:.6rem;" class="openwxchat">
                            <img src="/View_Mobile/Images/phone-plus4.png" style="width:1.4rem;height:1.4rem;">
                        </a>
                        <a ms-attr-href="'sms:'+user.mobphone" external style=" padding-top:.6rem;">
                            <!--<i class="  fa fa-envelope-o" style="display: block; position: absolute;left: 0.41rem;color:darkgray;top: 0.6rem; font-size: 1rem;"></i>-->
                            <img src="/View_Mobile/Images/phone-plus3.png" style="width:1.4rem;height:1.4rem;">
                        </a>
                    </span>
                </li>
            </ul>
        </script>
        <ul class="main-lis clearfix" style="overflow:auto">
            <li ms-repeat-bm="USERModel.SubDept" class="add-li bmsel" ms-visible="bm.DeptUser.size()>0||bm.SubDept.size()>0">
                <i ms-if="!searstr" class="fa fa-group" style="display: block;position: absolute;left: 0.41rem;color:darkgray;top: 0.6rem; font-size: 0.8rem;"></i>
                <a ms-if="!searstr" ms-on-click="entbm(bm,this)" external>{{bm.DeptName}}({{bm.DeptUserNum}})</a>
                <label class="check" ms-if="isseltype" style="height:2.1rem;padding-left:10px;" ms-on-click="checkbm(bm,this)" ms-visible="!singleSelect">
                    <i class="fa fa-square-o fa-check-square fabm" ms-attr-id="'branch'+bm.DeptCode"></i>
                </label>
                <div class="puser" ms-include="'tmpltree'" ms-visible="searstr"></div>
            </li>
        </ul>
        <ul class="subper mess-lis" ms-visible="DeptUser&&DeptUser.size()>0">
            <li class="add-li" ms-repeat-user="DeptUser" ms-visible="(searstr&&(user.UserRealName.indexOf(searstr)!=-1||user.mobphone.indexOf(searstr)!=-1))||!searstr">
                <span class="clearfix" external>
                    <span class="mes-icon">
                        <img ms-attr-src="/ViewV5/Base/DownFile.aspx?type=TX&user={{user.UserName}}">
                    </span>
                    <div class="mess-r "> <span ms-if="isseltype"><h4 style="margin-bottom:0">{{user.UserRealName.length==2?user.UserRealName.substring(0,1)+'&nbsp;&nbsp;&nbsp;&nbsp;'+user.UserRealName.substring(1):user.UserRealName}}&nbsp; <font style="color:cornflowerblue"><i class="fa  fa-mobile-phone"></i>{{user.mobphone}}</font>  </h4> <p style="margin:0">{{user.zhiwu}}</p></span>  <a ms-attr-href="'tel:'+user.mobphone" external ms-if="!isseltype"><h4 style="margin-bottom:0">{{user.UserRealName.length==2?user.UserRealName.substring(0,1)+'&nbsp;&nbsp;&nbsp;&nbsp;'+user.UserRealName.substring(1):user.UserRealName|html}}&nbsp;<font style="color:cornflowerblue"><i class="fa  fa-mobile-phone"></i>{{user.mobphone}}</font>  </h4> <p style="margin:0">{{user.zhiwu}}</p></a>  </div>
                </span>
                <label class="check" ms-if="isseltype" ms-on-click="checkuser(user,this,$event)" style="padding-left:10px;">
                    <i class="fa fa-square-o fa-check-square fauser" ms-attr-username="user.UserName" ms-attr-userrealname="user.UserRealName" ms-attr-id="'user'+replace(user.UserName)"></i>
                </label>
                <span style="right:.8rem;position:absolute;float:right;top:0;    display: -webkit-box;" ms-if="!isseltype">
                    <a ms-attr-href="javascript:ComFunJS.openEntChat('{{user.UserName}}')" external style=" padding-top:.6rem;" class="openwxchat">
                        <img src="/View_Mobile/Images/phone-plus4.png" style="width:1.4rem;height:1.4rem;">
                    </a>
                    <a ms-attr-href="'sms:'+user.mobphone" external style=" padding-top:.6rem;">
                        <!--<i class="  fa fa-envelope-o" style="display: block; position: absolute;left: 0.41rem;color:darkgray;top: 0.6rem; font-size: 1rem;"></i>-->
                        <img src="/View_Mobile/Images/phone-plus3.png" style="width:1.4rem;height:1.4rem;">
                    </a>
                </span>
            </li>
        </ul>
    </div>
        </div>
    <div class="bar bar-footer" ms-if="isseltype">

            <div class="row" style=" overflow: visible;">
                <div class="col-50"><a class="button  button-fill button-danger" ms-click="qxpeople()" external>取消</a></div>
                <div class="col-50"><a class="button  button-fill button-success" ms-click="selpeople()" external>确定</a></div>
            </div>

    </div>
</div>
<script>
    var tempmodeltxl = avalon.define({
        $id: "TXL",
        name: "通讯录",
        isseltype: true,//展示模式,false:通讯录,true:选人
        searstr: "",
        selusers: [],
        selAll:false,
        inittemp: function (obj) {
            tempmodeltxl.GetWXUser();
           // $(".add-lists").height($("body").height() - 100)//初始化高度
        },
        entbm: function (bm, dom) {//折叠部门
            $(dom).parent().find("div").eq(0).toggle();
        },
        USERModel: { DeptCode: "-1", DeptName: "组织机构", SubDept: [] },
        DeptUser: [],
        GetWXUser: function () {//获取用户数据接口
            $.getJSON('/API/VIEWAPI.ashx?Action=XTGL_GETWXUSER', function (resultData) {
                if (resultData.ErrorMsg == "") {
                    tempmodeltxl.USERModel.SubDept = resultData.Result;
                    tempmodeltxl.DeptUser = resultData.Result3;
                }
            })
        },
        checkall: function (dom) {//全选
            var sel = "";
            if (tempmodeltxl.selAll) {
                tempmodeltxl.selAll = false;
            } else {
                tempmodeltxl.selAll = true;
            }
            tempmodeltxl.USERModel.SubDept.forEach(function (item, i) {
                tempmodeltxl.checkbm(item, $("#branch" + item.DeptCode).parent(), tempmodeltxl.selAll);
            })
        },
        defSetUsers: function () {

            $(".sel-title label i").removeClass("sel");
            $(".add-lists .main-lis .add-li i").removeClass("sel");
            $(".add-lists .main-lis .add-li .puser").css("display", "none");
            $(".add-lists .fa-check-square").removeClass("sel");
            tempmodeltxl.selusers.clear();

            if ($("#" + peomodel.nowpeodomid).val()) {
               
                //选中人
                var usrN = $("#" + peomodel.nowpeodomid).val().split(',');
                var usrM = $("#dvname" + peomodel.nowpeodomid).html().split(',');
                for (var i = 0; i < usrN.length; i++) {
                    tempmodeltxl.selusers.push({ UserName: usrN[i], UserRealName: usrM[i] });
                    $("#user" + usrN[i]).addClass("sel");
                    //选中和展开部门
                    //$(".puser")
                }

            }

        },
        checkbm: function (bm, dom,sel) {//选择部门
            if (peomodel.singleSelect) {
                return;
            }
            if (sel == true) {//全部选中
                $(dom).find("i").addClass('sel');
                $(dom).parent().find(".fa").each(function () {
                    $(this).addClass('sel')
                })
                $(dom).parent().find(".fauser").each(function () {
                    tempmodeltxl.DelItem(tempmodeltxl.selusers, "UserName", $(this).attr("username"));
                    tempmodeltxl.selusers.push({ UserName: $(this).attr("username"), UserRealName: $(this).attr("userrealname") })
                })
            } else if (sel == false) { //全部不选中
                $(dom).find("i").removeClass('sel');
                $(dom).parent().find(".fa").each(function () {
                    $(this).removeClass('sel');
                })
                $(dom).parent().find(".fauser").each(function () {
                    tempmodeltxl.DelItem(tempmodeltxl.selusers, "UserName", $(this).attr("username"))
                })
            } else {
                if ($(dom).find("i").hasClass('sel')) {
                    $(dom).find("i").removeClass('sel');
                    tempmodeltxl.selAll = false;//取消全选
                    $(dom).parent().find(".fa").each(function () {
                        $(this).removeClass('sel');
                    })
                    $(dom).parent().find(".fauser").each(function () {
                        tempmodeltxl.DelItem(tempmodeltxl.selusers, "UserName", $(this).attr("username"))
                    })
                } else {
                    $(dom).find("i").addClass('sel');
                    $(dom).find("i").parent().parent().find(".fa").each(function () {
                        $(this).addClass('sel')
                    })
                    $(dom).parent().find(".fauser").each(function () {
                        tempmodeltxl.DelItem(tempmodeltxl.selusers, "UserName", $(this).attr("username"));
                        tempmodeltxl.selusers.push({ UserName: $(this).attr("username"), UserRealName: $(this).attr("userrealname") })
                    })
                }
            }

        },
        checkuser: function (user, dom, event) {//选择用户
            if (event) {
                event.stopPropagation();
            }
            if (peomodel.singleSelect) { 
                $(".add-lists .fa-check-square").removeClass("sel");
                tempmodeltxl.selusers.clear();
            }
            if ($(dom).find("i").hasClass('sel')) {
                tempmodeltxl.selAll = false;//取消全选
                $(dom).find("i").removeClass('sel');
                //部门取消全选
                $(dom).parents("li.bmsel").each(function (index, item) {
                    $(item).find("i.fabm").eq(0).removeClass("sel");
                    $(item).find("i.fa-group").eq(0).removeClass("sel");
                });
                //.find("i.fabm").removeClass("sel");
                //$(dom).parents("li.bmsel").find("i.fa-group").removeClass("sel");
            } else {
                $(dom).find("i").addClass('sel');
            }
            tempmodeltxl.DelItem(tempmodeltxl.selusers, "UserName", user.UserName)
            if ($(dom).find("i").hasClass("sel")) {
                tempmodeltxl.selusers.push(user.$model)
            }
        },
        clearuser: function (item, dom) {//清除选择用户
            tempmodeltxl.selusers.remove(item);
            tempmodeltxl.selAll = false;//取消全选

            var vdom = $("#user" + tempmodeltxl.replace(item.UserName));
            $(vdom).removeClass("sel");

            //$(vdom).find("i").removeClass('sel');
            //部门取消全选
            $(vdom).parent().parents("li.bmsel").each(function (index, item) {
                $(item).find("i.fabm").eq(0).removeClass("sel");
                $(item).find("i.fa-group").eq(0).removeClass("sel");
            });

            //$("#user" + item.UserName).removeClass("sel");
        },
        DelItem: function (items, delkey, delval) {//删除元素
            for (i = items.length - 1; i >= 0; i--) {
                if (items[i][delkey] == delval) {
                    items.splice(i, 1)
                }
            }
        },
        selpeople: function () { //确定选人时触发事件
            if (peomodel) {
                if (tempmodeltxl.selusers.size() > 0) {
                    var userName = "";
                    var userRealName = "";
                    tempmodeltxl.selusers.forEach(function (val, i) {
                        userName += val.UserName + ",";
                        userRealName += val.UserRealName + ",";
                    })
                    userName = userName.substring(0, userName.length - 1);
                    userRealName = userRealName.substring(0, userRealName.length - 1);
                    //给控件赋值
                    $("#" + peomodel.nowpeodomid).val(userName).trigger('change');
                    $("#dvname" + peomodel.nowpeodomid).html(userRealName);
                    $("#dvname" + peomodel.nowpeodomid).removeClass("color-gray");
                }
                else {
                    $("#" + peomodel.nowpeodomid).val("").trigger('change');

                    var msg = $("#dvname" + peomodel.nowpeodomid).parent().parent().find(".label").text();
                    $("#dvname" + peomodel.nowpeodomid).html("请选择" + msg);
                    $("#dvname" + peomodel.nowpeodomid).addClass("color-gray");
                }
                $("#pageindex1").show();
                $("#selpeople").hide();
            }
        },
        qxpeople: function () {
            $("#pageindex1").show();
            $("#selpeople").hide();
        },
        replace: function (source) {
            if (source) {
                source = source.replace(/@/g, '').replace(/\./g, '');
            } 
            return source;
        }
    })//@ sourceURL=WOrk.js;

</script>